<!DOCTYPE HTML>
<html lang="zh-cn">
  <head>
  	<meta charset="UTF-8">
    <title>Powerful JQuery Plugins</title>
    <link href="/js/jQueryUI/jquery-ui.css" type="text/css" rel="stylesheet"></link>
    <link href="/js/jQueryScrollbar/perfect-scrollbar.css" type="text/css" rel="stylesheet"></link>
	<style type="text/css">
		a {
			text-decoration: none
		}
		a.test {
			font-weight: bold;
		}
	</style>
  </head>
  
  <body>
  	<a href="http://jquery.com">jQuery</a>
  	<script src="/js/jQuery/jquery-1.11.3.js" type="text/javascript"></script>
  	<script src="/js/jQueryUI/jquery-ui.js" type="text/javascript"></script>
  	<script src="/js/jQueryValidation/jquery.validate.js" type="text/javascript"></script>
  	<script src="/js/jQueryValidation/messages_zh.js" type="text/javascript"></script>
  	<script src="/js/jQueryValidation/additional-methods.js" type="text/javascript"></script>
  	<script src="/js/jQueryValidation/additional-methods.js" type="text/javascript"></script>
  	<script src="/js/jQueryScrollbar/perfect-scrollbar.jquery.js" type="text/javascript"></script>
  	<script type="text/javascript">
  		//onload方法会等页面加载完全部的dom、等待所有的图片下载完毕，甚至是广告
  		window.onload = function() {
  			console.log("window初始化完毕！");
  		};
  		//为了确保dom一旦就绪，就执行使用$(document).ready(function() {})来进行判断
  		$(document).ready(function() {
  			$("a").click(function(event) {
  				if (!$("a").hasClass("test")) {
  					$("a").addClass("test");
  				} else {
  					$("a").removeClass("test");
  				}
  				console.log("触发点击事件！");
  				console.log(event);
  				//click等一系列事件都可以通过 event.preventDefault阻止默认的时间触发
  				event.preventDefault();
  				//return false 会阻止事件冒泡即执行完
  				//event.preventDefault之后
  				//还会执行event.stopPropagation
  				var me = this;
  				$(me).hide("slow", function() {
  					//无参回调函数不需要小括号
  					//有参回调函数如果直接使用方法名跟参数，将会导致回调函数立刻执行
  					$.get("/demo/index.html", callback("1", "2"));
  				});
  				$(me).hide("slow", function() {
  					//因此需要使用匿名函数包裹回调函数，才能到预期的效果
  					$.get("/demo/index.html", function() {
  						callback("1", "2")
  					});
  				});
  			});
  		});
  		function callback() {
  			console.log("回调函数执行成功！");
  		}
  		function callback(arg1, arg2) {
  			console.log("参数：" + arg1 + "|" +arg2);
  		}
  	</script>
  </body>
</html>
